import router from '@/router'
import axios from 'axios'
import store from '@/store'
import { Message } from 'element-ui'
// import { getToken } from '@/utils/auth'

// create an axios instance
const service = axios.create({
  // baseURL: 项目的基准地址
  // vue-cli  --->  webpack  ---> Node
  // process ---> 是Node 中的全局变量
  // process.env  --> 获取当前用户的环境变量信息
  // VUE_APP_BASE_API   是我们配置的项目的根域名
  // 开发环境  --->  就是目前我们代码的环境   --->   development
  // 生产环境  --->  就是项目上线以后运行的环境  ---> production
  // 当运行  npm run dev 的时候,  会解析  .env.development 这个文件
  // 当运行 npm  run  build 的时候,会解析,   .env.production  这个文件
  // 取出其中定义变量, 集成到项目中使用即可
  // ----------------------------------------
  // 获取变量的过程,  在使用  npm run xxx 命令时,  node 就已经获取到变量传入到 env 中了
  baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
  // baseURL: 'http://ihrm-java.itheima.net', // url = base url + request url
  // withCredentials: true, // send cookies when cross-domain requests
  // 请求超时, 当我们请求一个地址, 超过5000 毫秒以后, 还没返回,就报错
  timeout: 5000 // request timeout
})

// 请求拦截器
service.interceptors.request.use(
  config => {
    // 获取token
    const token = store.state.user.token

    if (token) {
      // 一般是用来给对象添加动态的属性
      // 新增属性常用的俩个方法一个是 . ,另一个就是使用 中括号 []
      config.headers['Authorization'] = `Bearer ${token}`
    }

    return config
  },
  error => {
    // do something with request error
    console.log(error) // for debug
    return Promise.reject(error)
  }
)

// 响应拦截器
// 如果使用 axios 发起请求, 会将返回的数据在包装一层
service.interceptors.response.use(
  response => {
    if (response.data.success) {
      // 数据正常，进行的逻辑功能
      // response.data 就是返回后端真正响应的数据
      return response.data
    } else {
      // 如果返回的 success 是 false，表明业务出错，直接触发 reject
    // 抛出的错误，被 catch 捕获
    // 接口响应失败错误提示
      Message({
        message: response.data.message,
        type: 'error',
        showClose: true,
        duration: 1000
      })
      return Promise.reject(new Error(response.data.message))
    }
  },
  async error => {
    // token 超时处理
    // 软件工程中,有一个思想: 健壮性,说白了就是进行多重的验证
    // 如果后端返回的状态码 等于 10002  说明token 失效
    if (error.response && error.response.data && error.response.data.code === 10002) {
      // 调用 action 方法 删除信息
      await store.dispatch('user/userLogout')
      // 跳转到登录页面
      router.push('/login')

      // 提示 token 失效
      return Message({
        message: '请求超时,请重新登录我滴宝',
        type: 'error',
        showClose: true,
        duration: 1000
      })
    }

    // 对网络延迟进行错误提示
    Message({
      message: error.message,
      type: 'error',
      showClose: true,
      duration: 1000
    })
    return Promise.reject(error)
  }
)

export default service

// // 请求拦截器
// service.interceptors.request.use(
//   config => {
//     // do something before request is sent

//     if (store.getters.token) {
//       // let each request carry token
//       // ['X-Token'] is a custom headers key
//       // please modify it according to the actual situation
//       config.headers['X-Token'] = getToken()
//     }
//     return config
//   },
//   error => {
//     // do something with request error
//     console.log(error) // for debug
//     return Promise.reject(error)
//   }
// )

// // 响应拦截器
// // 如果使用 axios 发起请求, 会将返回的数据在包装一层
// service.interceptors.response.use(
//   response => {
//     // 接受后端返回的真正的数据
//     const res = response.data

//     // if the custom code is not 20000, it is judged as an error.
//     if (res.code !== 20000) {
//       Message({
//         message: res.message || 'Error',
//         type: 'error',
//         duration: 5 * 1000
//       })

//       // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
//       if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
//         // to re-login
//         MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
//           confirmButtonText: 'Re-Login',
//           cancelButtonText: 'Cancel',
//           type: 'warning'
//         }).then(() => {
//           store.dispatch('user/resetToken').then(() => {
//             location.reload()
//           })
//         })
//       }
//       return Promise.reject(new Error(res.message || 'Error'))
//     } else {
//       return res
//     }
//   },
//   error => {
//     console.log('err' + error) // for debug
//     Message({
//       message: error.message,
//       type: 'error',
//       duration: 5 * 1000
//     })
//     return Promise.reject(error)
//   }
// )

